<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>template 制作模板</title>
	<script type="text/javascript" src="../assets/js/vue.js"></script>
</head>
<body>
	<h1>template 三种写法</h1>

	<hr>
	<div id="app">
		{{message}}
		
	</div>
    <template id="tem">
        <h2 style="color:blue">我是template模板</h2>
    </template>
    <script type="x-template" id="xtem">
        <h2 style="color:blue">我是script模板</h2>
    </script>

</body>
<script type="text/javascript">
var app = new Vue({
	el:'#app',
	data:{
		message:'hello ',
        red:'green'
	},
    // template:"#tem"
    template:"#xtem"
    // template:`
    //     <h2 :style="{color:red}">我是选项模板</h2>
    // `
    // template:`
    //     <h2 style="color:red">我是选项模板</h2>
    // `
})

</script>
</html>